// tailwind.config.js
/** @type {import('tailwindcss').Config} */
export default {
  darkMode: 'class',  // 启用 class 策略的暗色模式
  content: [
    "./index.html",
    "./src/**/*.{vue,js,ts,jsx,tsx}", 
  ],
  theme: {
    extend: {
      // 在这里定义你的自定义动画、颜色等
      // 比如之前的 slide-in 动画
      keyframes: {
        'slide-in-right': {
          '0%': { transform: 'translateX(100%)', opacity: '0' },
          '100%': { transform: 'translateX(0)', opacity: '1' },
        },
        // ...其他 keyframes
      },
      animation: {
        'slide-in-right': 'slide-in-right 0.3s ease-out forwards',
        // ...其他 animation
      },
      colors: {
        'bkg': 'var(--color-bkg)', // 背景色
        'text-primary': 'var(--color-text-primary)', // 主要文字颜色
        'text-secondary': 'var(--color-text-secondary)', // 次要文字颜色
        'accent': 'var(--color-accent)', // 强调色
      }
    },
  },
  plugins: [],
}
